import React, { Component } from 'react'
import { Route, NavLink, Redirect } from 'react-router-dom'
import Classify from './home/Classify'
import Car from './home/Car'
import My from './home/My'

export default class Home extends Component {
    state = {
        routes: [
            {
                path: "/home/classify",
                com: Classify,
                title: "分类"
            },
            {
                path: "/home/car",
                com: Car,
                title: "购物车"
            },
            {
                path: "/home/my",
                com: My,
                title: "我的"
            }
        ]
    }
    render() {
        const { routes } = this.state
        return (
            <div className="h100 home">
                <header>头部</header>
                <main>
                    {
                        routes.map((item, index) => {
                            return <Route path={ item.path } key={ index } component={ item.com }/>
                        })
                    }
                    {/* <Redirect to="/home/classify"/> */}
                </main>
                <footer>
                    {
                        routes.map((item, index) => {
                            return <NavLink to={item.path} key={index}>
                                {item.title}
                            </NavLink>
                        })
                    }
                </footer>
            </div>
        )
    }
}
